<!--TVM收入差异审核 TVM日结账单据录入-->
<template>
  <div class="cashboxUninstall">
    <basic-container>
      <avue-crud
        ref="crud"
        :option="option"
        :table-loading="listLoading"
        :data="list"
        :page.sync="page"
        @search-change="handleFilter"
        @selection-change="selectionChange"
        @on-load="getList">
        <template slot-scope="scope" slot="menuRight">
          <el-button type="primary"  size="mini" @click="addData()">添加</el-button>
          <el-button type="primary"  size="mini" @click="exportData">导出</el-button>
        </template>
        <template slot-scope="scope" slot="lineCodeSearch">
          <el-select v-model="searchForm.lineCode" placeholder="请选择" style="width: 150px" @change="changeLine" filterable>
            <el-option
              v-for="(item,index) in lineCodes"
              :key="index"
              :label="item.name"
              :value="item.code">
            </el-option>
          </el-select>
        </template>
        <template slot-scope="scope" slot="stationCodeSearch">
          <el-select v-model="searchForm.stationCode" placeholder="请选择" style="width: 150px" @change="changeStation" filterable>
            <el-option
              v-for="(item,index) in stationCodes"
              :key="index"
              :label="item.name"
              :value="item.code">
            </el-option>
          </el-select>
        </template>
        <template slot-scope="scope" slot="tvmCodeSearch">
          <el-select v-model="searchForm.tvmCode" placeholder="请选择" style="width: 150px"  filterable>
            <el-option
              v-for="(item,index) in tvmCodes"
              :key="index"
              :label="item.tvmCode"
              :value="item.tvmCode">
            </el-option>
          </el-select>
        </template>
        <template slot="search" slot-scope="{row,size}">
          <el-form-item label="录入开始时间">
            <el-date-picker
              clearable
              v-model="searchForm.startTime"
              value-format='yyyy-MM-dd'
              type="date"
              placeholder="选择日期">
            </el-date-picker>
          </el-form-item>
          <el-form-item label="录入结束时间">
            <el-date-picker
              clearable
              v-model="searchForm.endTime"
              value-format='yyyy-MM-dd'
              type="date"
              placeholder="选择日期">
            </el-date-picker>
          </el-form-item>
        </template>
        <template slot="searchMenu" slot-scope="{row,size}">
          <el-button :size="size" @click="()=>{setSearchFiledsEmpty(row);setSearchFiledsEmpty(searchForm)}" icon="el-icon-delete">清空</el-button>
        </template>
        <template slot-scope="scope" slot="menu">
          <el-button type="text" v-if="scope.row.dataSource=='2'" size="small" plain @click.stop="editor(scope.row,1)">编辑</el-button>
          <el-button type="text" size="small" plain @click.stop="preview(scope.row,3)">预览</el-button>
        </template>
      </avue-crud>
      <EditorOrAdd ref="EditorOrAdd" v-if="isShowDia"></EditorOrAdd>
    <preView ref="preView" v-if="isPreview"></preView>
    </basic-container>
  </div>

</template>

<script>
  import {getForm, postForm} from '@/api/gen/gen'
  import EditorOrAdd from './EditorOrAdd.vue';
  import preView from './preView';
  import {mapGetters} from 'vuex';
  import {tableOption,getSwStTvmDailyBillList} from '../../../../../api/subwayRat/TVMRevenueVarianceAudit.TvmChaYiDXC/TVMRiJieDanJuInput.js';
  import {
    getgetStationCodes,
    getLineCodes,
    setSearchFiledsEmpty,getSwPmTvmCodeList
  } from "../../../../../api/subwayRat/commonCheck";
  import {exportDataToExcel} from "../../../../../api/subwayRat/exportSelf";
  export default {
    name: 'cashboxUninstall',
    components:{
      EditorOrAdd,
      preView
    },
    data() {
      return {
        isShowDia:false,
        isPreview:false,
        option: tableOption,
        listLoading: true,
        lineCodes:[],
        stationCodes:[],
        tvmCodes:[],
        operatorJobNos:[],
        selectKeys:[],
        selectKeyVals:[],
        searchForm:{
          lineCode:'',
          stationCode:''
        },
        page: {
          total: 0, // 总页数
          currentPage: 1, // 当前页数
          pageSize: 20, // 每页显示多少条,
          isAsc: false// 是否倒序
        },
        list : []
      }
    },
    computed: {
      ...mapGetters(['permissions'])
    },
    watch: {
    },
    created() {
    },
    methods: {
      setSearchFiledsEmpty,
      changeStation(v){ //改变车站
        let param={};
        param.lineCode=this.searchForm.lineCode;
        param.stationCode=v;
        getSwPmTvmCodeList(param).then(r=>{
          this.tvmCodes=r.data;
        });
      },
      addData(){
        this.isShowDia=true;
        this.$nextTick(()=>{
          this.$refs.EditorOrAdd.dialogVisible=true;
          this.$refs.EditorOrAdd.clearForm();
          this.$refs.EditorOrAdd.recallShow(null,{},2,this);
        })
      },
      editor(row,showType){
        this.isShowDia=true;
        this.$nextTick(()=>{
          this.$refs.EditorOrAdd.dialogVisible=true;
          this.$refs.EditorOrAdd.recallShow(row.id,row,showType,this);
        })
      },
      preview(row,showType){
        this.isPreview=true;
        this.$nextTick(()=>{
          this.$refs.preView.dialogVisible=true;
          this.$refs.preView.recallShow(row.id,row,showType,this);
        })
      },
      getList() {
        this.listLoading = true;
        Object.assign(this.searchForm,this.page);
        getSwStTvmDailyBillList(this.searchForm).then((response)=>{
          this.list = response.data.data;
          this.listLoading = false;
          this.page.total=response.data.total;
        });
      },
      selectionChange(list){
        this.selectKeys=list;
        this.selectKeyVals=[];
        for(let i=0;i<list.length;i++){
          this.selectKeyVals.push(list[i].id);
        }
      },
      handleFilter(params, done) {
        Object.assign(this.searchForm,params);
        this.getList()
        done()
      },
      changeLine(v){ //改变线路时
        getgetStationCodes(v).then(res=>{
          this.stationCodes=res;
          this.searchForm.stationCode='';
        })
      },
      async exportData(){ // 导出
        let p={};
        Object.assign(p,this.searchForm);
        p.pageNo=1;
        p.pageSize=1000000000;
        if(this.selectKeys.length>0){
            exportDataToExcel(this.selectKeys,this.option.column,'TVM日结账单录入');
        }else {
          let res=await getSwStTvmDailyBillList(p);
          let data = res.data.data;
          exportDataToExcel(data,this.option.column,'TVM日结账单录入');
        }
      },
    },
    mounted() {
      getLineCodes().then(res=>{ //获取线路
        this.lineCodes=res;
      });
    }
  }
</script>
<style lang="scss">
  .cashboxUninstall {
    height: 100%;

    &__tree {
      padding-top: 3px;
      padding-right: 20px;
    }

    &__main {
      .el-card__body {
        padding-top: 0;
      }
    }
  }
</style>
